<template>
    <div>
        <el-form :inline="true"  @submit.native.prevent :model="searchForm">
            <el-form-item label="下载人：">
                <el-input v-model="searchForm.agentName"  @keyup.enter.native="getDownloadLinks" clearable></el-input>
            </el-form-item>
            <el-form-item class="btnArea">
                <el-button type="primary"  @click="getDownloadLinks">搜索查询</el-button>
            </el-form-item>
        </el-form>
        <!-- :download="scope.row.fileName+'.xls'" -->
        <el-table :data="tbpg.tableData" border v-cloak >
            <el-table-column type="index" label="序号"></el-table-column>
            <el-table-column label="文件名">
                <template slot-scope="scope">
                    <a v-if="scope.row.state == 2 && scope.row.exportUrl!=null" :href="getImgUrl() + scope.row.exportUrl"  :download = "formatDownloadName(scope.row.exportName, scope.row.exportUrl)"  target="_blank" >{{ scope.row.exportName  }}</a>

                    <!-- <a v-if="scope.row.status == 2 && scope.row.filePath!=null" href="javascript:void(0);"  @click = "downloadRes( getImgUrl()+scope.row.filePath, scope.row.fileName)"  target="_self" >{{ scope.row.fileName  }}</a> -->
                    <span v-else>{{ scope.row.exportName  }}</span>
                </template>
            </el-table-column>
            <el-table-column prop="createTime" label="开始时间"></el-table-column>            
            <el-table-column prop="endTime" label="结束时间"></el-table-column>
            <el-table-column prop="userName" label="下载人"></el-table-column>  
            <el-table-column prop="stateName" label="状态"></el-table-column>       
        </el-table>
        <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="tbpg.currentPage"
            :page-sizes="[15, 50, 100, 500]"
            :page-size="tbpg.pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="tbpg.total">
        </el-pagination> 
    </div>
</template>
<script>
import common from '@/utils/common.js'
export default {
    data(){
        return {
            searchForm: {
                agentName: ''
            },
            tbpg: {
                tableData: [],
                currentPage: 1,
                pageSize: 15,
                total: 0
            }
        }
    },
    methods: {
        showbtnText(status){
            return common.showTxtByState(status, {1: '数据处理中', 2: '数据处理完成', 3: '数据处理失败', 4:'已下载'})
        },
        getDownloadLinks($event){
            common.resetCurrentPage(this, $event, 'tbpg');
            var data = common.getRequestParams(this, 'tbpg', this.searchForm);
            //获取表格数据
            common.sysRequest('excels/export/syncTaskList', data, 'post').then(res => {
                common.listCallback(this, res, 'tbpg');
            }).catch(err=>{
                this.$message.error(err.data.message);
            });
        },
		
        downloadRes(filePath, fileName){
            let iframe = document.createElement('iframe');
            let a = document.createElement('a');
            a.href = filePath;
            //修改文件名
            a.download = this.formatDownloadName(fileName, filePath);
            iframe.appendChild(a);
            document.body.appendChild(iframe)
            
            // 触发点击
            a.click()
            //移除
            setTimeout(() => document.body.removeChild(iframe), 800)
        },

        formatDownloadName(fileName, filePath){
            let nameArr = filePath.split('.');
            return fileName + this.dateFormat('yyyy-MM-dd', new Date()) + '.'+ nameArr[nameArr.length-1];
        },
        handleSizeChange(val){
            this.tbpg.pageSize = val;
            this.getDownloadLinks();
        },
        handleCurrentChange(val){
            this.tbpg.currentPage = val;
            this.getDownloadLinks();
        },
		downloadListTimmer(){
			let that = this;
			setInterval(()=>{
				that.getDownloadLinks();
			}, 5000)
		}
		
    },
    created () { 
		let that = this;
		that.getDownloadLinks();
		// that.downloadListTimmer()
    }
}
</script>
<style lang="less" scoped>

</style>
